<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	
	<title>Vue组件注册-全局-局部注册</title>
</head>
<body>
	<div id="app1">
		<demo-test></demo-test>
		<br>
		<demo-test></demo-test>
	</div>
	<div id="app2">
  		<mytest></mytest>
	</div>
</body>
</html>
<script type="text/javascript">
	
	var MyTest={template:'<h1>局部注册组件</h1>'}
	
	Vue.component("demo-test",{
		template:'<h1>组件名使用 kebab-case, 全局注册组件</h1>'
	});

	Vue.component("DemoTest",{
		template:'<h1>组件名使用使用 PascalCase, 全局注册组件</h1>'
	});

	var app1=new Vue({
		el:'#app1',
	});
	
	//局部注册
	var app2=new Vue({
	  el:'#app2',
	  components:{
	    'mytest':MyTest,
	  },
	});
</script>